<template>
  <div>
    <p :class="{redStr: bool}">值为true, key作为类名生效</p>
    <p class="redStr" :class="classArr">传入数组, 可以设置多个类名, 也可以和静态共存</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      bool: true,
      classArr: ['blueStr', 'pinkStr']
    };
  }
};
</script>

<style scoped>
.redStr{
  color: red;
}
.blueStr{
  color: blue;
}
.pinkStr{
  color: pink;
}
</style>